<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>事件委托</title>
</head>

<body>
    <div id="contianer" style="background-color:grey">
        <div id="one">
            <button id="oneIn">点击</button>
        </div>
        <div id="two">twotwotwotwotwotwo</div>
        <div id="three">threethreethreethreethree</div>
    </div>
</body>
<script>
var $contianer = document.querySelector('body') || document.getElementById('contianer');
$contianer.addEventListener('click', function(e) {
    var currEvent = e.target;

    switch (currEvent.id) {
        case 'one':
            var iii = 111;
            console.log('click one!!!');
            break;
        case 'two':
            console.log('click two!!!');
            break;
        case 'three':
            console.log('click three!!!');
            break;
        case 'oneIn':
            console.log('click oneIn!!!');
            break;
    }
}, false);
</script>

</html>
